import React from 'react'
import { Tabs,Table,Modal,Badge } from 'antd'
import moment from "moment"

const TabPane = Tabs.TabPane;
const confirm = Modal.confirm

class List extends React.Component {
	constructor(props) {
		super(props)
		
		this.state = {
			
		}
	}
	
	callback = key =>{
//		console.log(key)
	}
	edit  = (record, e,text) => {
		const params ={
			id:record.id,
			operatingType:2
		}
		const {showPage,showDet,onComponent,isFileComponent,showModals} = this.props
		if(e == 1){
			showPage(params)
			
		}else if(e == 2){
			showModals("new")
			showDet(params)

		}else if(e == 3){
			showModals("update")
			showDet(params)
		}
		
	}
	editComponent = (record,e,text) =>{
		const {showModals} = this.props
		showModals()
	}
	async pageChange(pagination) {
	    await this.props.onPageChange(pagination);
	    this.newPage = pagination.current;
	}
	
	render(){
		const {menu,list,loading,pagination1} = this.props
		const columns = [
	      {
	        title: "档案编号",
	        dataIndex: "number",
	        key: "number",
	      },{
	        title: "档案名称",
	        dataIndex: "title",
	        key: "title",
	      },
	      {
	        title: "档案类型",
	        dataIndex: "archivesType",
	        key: "archivesType",
	      },
	      {
	        title: "业务类型",
	        dataIndex: "businessType",
	        key: "businessType",
	      },
	      {
	        title: "状态",
	        dataIndex: "state",
	        key: "state",
	        render:(text,record) =>{
	        		return(
	        		<p>
	              {	text == 0 ? 
	              	'未归档':
	              	'已归档'
	              }
	            </p>
	        		)
	        }
	      },	      
	      {
	        title: "申请状态",
	        dataIndex: "auditState",
	        key: "auditState",
	        render:(text,record) =>{
	        		return(
	        		<div>
	              {	record.operatingType != 2 ? 
	              	<div><Badge status="processing" /><span>未申请</span></div>:
	              	record.auditState == undefined?
	              	<div><Badge status="processing" /><span>未申请</span></div>:
	              	record.auditState == 0?
	              	<div><Badge status="warning" /><span>申请中</span></div>:
	              	record.auditState == 1?
	              	<div><Badge status="success" /><span>通过</span></div>:
	              	<div><Badge status="error" /><span>拒绝</span></div>
	              }
	            </div>
	        		)
	        }
	      },
	      {
	        title: "所属机构",
	        dataIndex: "organizationName",
	        key: "organizationName",
	      },
	      {
	        title: "管理人",
	        dataIndex: "createUserName",
	        key: "createUserName",
	      },
	      {
	        title: "创建日期",
	        dataIndex: "createTime",
	        key: "createTime",
	        render: (text, record) => {
	          return (
	            <p>
	              {
	                moment(record.createTime).format("YYYY-MM-DD HH:mm:ss")
	              }
	            </p>
	          );
       	 }
	      }
	      ,{
	        title: '操作',
	        dataIndex:'operation',
	        key: 'operation',
	        render:(text,record) =>{
	        		return(
	        			<div>
	        				{record.state == 0 ?
	        					<span onClick={this.edit.bind(null,record,1)} style={{marginRight:5}}><a href="#">销毁</a></span>:
	        					record.operatingType != 2 ?
	        					<span onClick={this.edit.bind(null,record,2)} style={{marginRight:5}}><a href="#">申请销毁</a></span>:
	        					record.auditState == undefined || record.auditState == 2?
	        					<span onClick={this.edit.bind(null,record,2)} style={{marginRight:5}}><a href="#">申请销毁</a></span>:
	        					record.auditState == 1?
	        					<span onClick={this.edit.bind(null,record,1)} style={{marginRight:5}}><a href="#">销毁</a></span>:
	        					''
	        				}
	        			</div>
	        		)
	        }
      } 
	 ];
	
		const columns1 = [
	      {
	        title: "档案编号",
	        dataIndex: "number",
	        key: "number",
	      },
	      {
	        title: "档案名称",
	        dataIndex: "title",
	        key: "title",
	      },
	      {
	        title: "档案类型",
	        dataIndex: "archivesType",
	        key: "archivesType",
	      },
	      {
	        title: "业务类型",
	        dataIndex: "businessType",
	        key: "businessType",
	      },
	      {
	        title: "状态",
	        dataIndex: "state",
	        key: "state",
	        render:(text,record) =>{
	        		return(
	        		<p>
	              {	text == 0 ? 
	              	'未归档':
	              	'已归档'
	              }
	            </p>
	        		)
	        }
	      },	
	      {
	        title: "所属机构",
	        dataIndex: "organizationName",
	        key: "organizationName",
	      },
	      {
	        title: "管理人",
	        dataIndex: "createUserName",
	        key: "createUserName",
	      },
	      {
	        title: "申请提交日期",
	        dataIndex: "applyTime",
	        key: "applyTime",
	        render: (text, record) => {
	          return (
	            <p>
	              {
	                moment(record.applyTime).format("YYYY-MM-DD HH:mm:ss")
	              }
	            </p>
	          );
       	 }
	      }
	      ,{
	        title: '操作',
	        dataIndex:'operation',
	        key: 'operation',
	        render:(text,record) =>{
	        		return(
	        			<div>
	        				<span onClick={this.edit.bind(null,record,3)} style={{marginRight:5}}><a href="#">审核</a></span>
	        			</div>
	        		)
	        }
      } 
	 ];
	 
		const columns2 = [
	      {
	        title: "档案编号",
	        dataIndex: "number",
	        key: "number",
	      },
	      {
	        title: "档案名称",
	        dataIndex: "title",
	        key: "title",
	      },
	      {
	        title: "档案类型",
	        dataIndex: "archivesType",
	        key: "archivesType",
	      },
	      {
	        title: "业务类型",
	        dataIndex: "businessType",
	        key: "businessType",
	      },
	      {
	        title: "状态",
	        dataIndex: "state",
	        key: "state",
	        render:(text,record) =>{
	        		return(
	        		<p>
	              {	text == 0 ? 
	              	'未归档':
	              	'已归档'
	              }
	            </p>
	        		)
	        }
	      },	
	      {
	        title: "所属机构",
	        dataIndex: "organizationName",
	        key: "organizationName",
	      },
	      {
	        title: "管理人",
	        dataIndex: "createUserName",
	        key: "createUserName",
	      },
	      {
	        title: "申请提交日期",
	        dataIndex: "applyTime",
	        key: "applyTime",
	        render: (text, record) => {
	          return (
	            <p>
	              {
	                moment(record.applyTime).format("YYYY-MM-DD HH:mm:ss")
	              }
	            </p>
	          );
       	 	}
	      },
	      {
	        title: "状态",
	        dataIndex: "auditState",
	        key: "auditState",
	        render:(text,record) =>{
	        		return(
	              <div>
	        				{record.auditState == 0 ?
	        					<div><Badge status="processing" /><span>申请中</span></div>:
	        				 record.auditState == 1 ?
	        				 	<div><Badge status="success" /><span>通过</span></div>:
	        				 	<div><Badge status="error" /><span>拒绝</span></div>
	        				}
	        			</div>
	        		)
	        }
	      },	
	      {
	        title: '操作',
	        dataIndex:'operation',
	        key: 'operation',
	        render:(text,record) =>{
	        		return(
	        			<div>
	        				{record.auditState == 1 ?
	        					<span onClick={this.edit.bind(null,record,1)} style={{marginRight:5}}><a href="#">销毁</a></span>:
	        					<span style={{marginRight:5,color:"gray"}}>销毁</span>
	        				}
	        				
	        			</div>
	        		)
	        }
      } 
	 ];	 
		const columns3 = [
	      {
	        title: "档案编号",
	        dataIndex: "number",
	        key: "number",
	      },
	      {
	        title: "档案名称",
	        dataIndex: "title",
	        key: "title",
	      },
	      {
	        title: "档案类型",
	        dataIndex: "archivesType",
	        key: "archivesType",
	      },
	      {
	        title: "业务类型",
	        dataIndex: "businessType",
	        key: "businessType",
	      },
	      {
	        title: "状态",
	        dataIndex: "state",
	        key: "state",
	        render:(text,record) =>{
	        		return(
	        		<p>
	              {	text == 0 ? 
	              	'未归档':
	              	'已归档'
	              }
	            </p>
	        		)
	        }
	      },	
	      {
	        title: "所属机构",
	        dataIndex: "organizationName",
	        key: "organizationName",
	      },
	      {
	        title: "管理人",
	        dataIndex: "createUserName",
	        key: "createUserName",
	      },
	      {
	        title: "申请提交日期",
	        dataIndex: "applyTime",
	        key: "applyTime",
	        render: (text, record) => {
	          return (
	            <p>
	              {
	                moment(record.applyTime).format("YYYY-MM-DD HH:mm:ss")
	              }
	            </p>
	          );
       	 	}
	      },
	      {
	        title: '审核结果',
	        dataIndex:'operation',
	        key: 'operation',
	        render:(text,record) =>{
	        		return(
	        			<div>
	        				{record.auditState == 0 ?
	        					<div><Badge status="processing" /><span>未审核</span></div>:
	        				 record.auditState == 1 ?
	        				 	<div><Badge status="success" /><span>审核通过</span></div>:
	        				 	<div><Badge status="error" /><span>审核拒绝</span></div>
	        				}
	        			</div>
	        		)
	        }
      } 
	 ];		 
		return(
			<div>
				{menu == 0?
					<Table
			          columns={columns}
			          dataSource={list}
			          loading={loading}
			          onChange={this.pageChange.bind(this)}
			          pagination={pagination1}
			        />:
			     menu == 1?
			        <Table
			          columns={columns1}
			          dataSource={list}
			          loading={loading}
			          onChange={this.pageChange.bind(this)}
			          pagination={pagination1}
			        />:
			     menu == 2?
			     	<Table
			          columns={columns2}
			          dataSource={list}
			          loading={loading}
			          onChange={this.pageChange.bind(this)}
			          pagination={pagination1}
			        />:
			        <Table
			          columns={columns3}
			          dataSource={list}
			          loading={loading}
			          onChange={this.pageChange.bind(this)}
			          pagination={pagination1}
			        />
				}
				
			</div>
		)
	}
}

export default List